var timer = {};
/*
* 实时获取分类列表
*/
function live_category_list(callback){
    clearInterval(timer.shop_list);
    var http = function(){
        $.ajax({
            url: API.category_list + '?r=' + Math.random(),
            type: 'GET',
            dataType: 'json',
            data: {}
        }).done(function(json) {
            if (1 == json.status) {
                callback(json.data);
            } else {
                clearInterval(timer.category_list);
                alert(json.info);
            }
        }).fail(function() {
            alert('网络延迟！点击确定刷新页面,code-1');
            clearInterval(timer.category_list);
            // window.location.reload();
        });        
    }
    // 触发事件
    http();
    timer.category_list = setInterval(function(){
        http()
    }, INTERVAL);
}

function live_number(callback){
    clearInterval(timer.number);
    var http = function(){
        $.ajax({
            url: API.number + '?r=' + Math.random(),
            dataType: 'json'
        }).done(function(json) {
            if(1 == json.status) {
                callback(json.data);
            } else {
                clearInterval(timer.number);
                alert(json.info);
            }
        });         
    }
    // 触发事件
    http();
    timer.number = setInterval(function(){
        http();
    }, INTERVAL);
}

function live_shop_list(category_id, callback) {
    clearInterval(timer.category_list);
    var http = function(){
        $.ajax({
            url: API.shop_list + '?r=' + Math.random(),
            dataType: 'json',
            data: {id: category_id},
        }).done(function(json) {
            if(1 == json.status) {
                callback(json.data);
            } else {
                clearInterval(timer.shop_list);
                alert(json.info);
            }
        });         
    }
    // 触发事件
    http();
    timer.shop_list = setInterval(function(){
        http();
    }, INTERVAL);
}

function get_rank_list(category_id, callback){
    clearInterval(timer.shop_list);
    $.ajax({
        url: API.shop_list + '?r=' + Math.random(),
        dataType: 'json',
        data: {id: category_id},
    }).done(function(json) {
        if(1 == json.status) {
            callback(json.data);
        } else {
            alert(json.info);
        }
    });  
}

/*
* Vue
*/
var vm = new Vue({
    'el': 'body',
    'data': {
        'active': 'category_list',
        'category_list': [],
        'shop_list': [],
        'category_id_active': null,
        'category_name_active': '',
        'show_rank_num': false,
        'number': {}
    },
    'created': function() {
        var _this = this;
        live_category_list(function(json){
            _this.category_list = json;
        });

        live_number(function(json){
            _this.number = json;
        });

        var container = document.getElementById('table-rank-body');
        var drake = dragula([container]).on('drop', function(el) {
            $('#table-rank-body>li').each(function(i) {
                i++;
                $(this).find('.num').eq(0).html(i);
            });
        });
    },
    'methods': {
        'getCategoryList': function(){
            var _this = this;
            this.active = 'category_list';
            _this.category_list = {};
            live_category_list(function(json){
                _this.category_list = json;
            });
        },
        'showOrderNum': function(){
            this.show_rank_num = true;
            $('#table-rank-body>li').each(function(i) {
                i++;
                $(this).find('.num').eq(0).html(i).css({ 'opacity': 1 });
            });
        },
        'hiddenOrderNum': function(){
            this.show_rank_num = false;
            $('#table-rank-body>li').each(function(i) {
                i++;
                $(this).find('.num').eq(0).html(i).css({ 'opacity': 0 });
            });
        },
        'liveShopList': function(category_id, category_name){
            var _this = this;
            this.active = 'shop_list';
            this.category_name_active = category_name;
            this.category_id_active = category_id;
            _this.shop_list = {};
            live_shop_list(category_id, function(json){
                _this.shop_list = json;
            });
        },
        'getRankList': function(){
            var _this = this;
            _this.shop_list = {};
            get_rank_list(this.category_id_active, function(json){
                _this.shop_list = json;
                _this.active = 'rank_list';
                _this.hiddenOrderNum();
            });
        }
    }
});
